<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="../build/react.js" type="text/javascript" charset="utf-8"></script>
		<script src="../build/react-dom.js" type="text/javascript" charset="utf-8"></script>
		<script src="../build/browser.min.js" type="text/javascript" charset="utf-8"></script>
	</head>

	<body>
		<div id="example">hello world</div>
		<script type="text/babel">
			//变量名只能大写
			var data = 123;
	        var MyTitle = React.createClass({
	        	getDefaultProps : function () {
			    return {
			    	title : 'Hello World'
			    }},
				        propTypes: {
		          title: React.PropTypes.string.isRequired,
		        },
		
		        render: function() {
		          return <h1> {this.props.title} </h1>;
		        }
	        });
			
			ReactDOM.render(
			<article>
				<h1 style={{color:'orange'}}>Hello World!</h1>
				<MyTitle/>
			</article>, 
			document.getElementById("example")
			);
		</script>
	</body>

</html>